<html>
<head>
	<title>Busloop - It's happening</title>
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
	<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
	<style>
		body{
			padding: 0;
			margin: 0;
			background-image: url(graphics/texture-1.png);
			font-family: 'Open Sans Condensed';
		}
		#powerlay{
			position: absolute;
			left: 0; top: 0;
			width: 100%;
			height: 100%;
			background: -webkit-radial-gradient(circle, #fff, #0d56a6);
			background: -moz-radial-gradient(circle, #fff, #000);
			opacity: .2;
			-moz-opacity: .2;
		}
		#splash{
			position: absolute;
			width: 100%;
			display: none;
		}
		#footer{
			position: fixed;
			width: 100%;
			bottom: 35px;
			color: #555;
			font-size: .9em;
			
		}
		p.big{
			font-size: 1.5em;
		}
		#stripes{
			position: fixed;
			width: 100%;
			bottom: 0px;
		}
		#stripe1{
			opacity: .8;
			height: 20px;
			background: #ffc873;
			
		}
		#stripe2{
			opacity: .8;
			height: 10px;
			background: #ffb440;
			background: #ff9a00;
		}
	</style>
	<script>
		$(document).ready(function(){
			$('#splash').css('top',(0.8*window.innerHeight/2-$('#splash').outerHeight()/2)+'px').fadeIn()
			})
	</script>
</head>
<body>
	<div id="powerlay"></div>
	<div id="splash" align="center">
		<img src="graphics/busloop.png" />
		<p class="big" style="color:#0d56a6">
		Unlike the B-Line, we're in Stealth Mode.
		</p>	
	</div>
	<div id="stripes">
		<div id="stripe1"></div>
		<div id="stripe2"></div>
	</div>
	<div id="footer" align="center">
		2011&ndash; Busloop, Inc. 1946 W 13th Avenune, Vancouver, BC.
	</div>
</body>